// pages/info/info.js
import Toast from '@vant/weapp/toast/toast';
import { formatDate } from '../../utils/format'
import { createStoreBindings } from 'mobx-miniprogram-bindings'
import { store } from '../../store/store'

Page({

  /**
   * 页面的初始数据
   */
  data: {
    name: '',
    nameInput: '',
    showName: false,
    formatDate: '',
    birthDate: '',
    minDate: new Date(1900, 1, 1).getTime(),
    maxDate: new Date().getTime(),
    showBirth: false, // 生日弹出层
    showGender: false, // 性别弹出层
    gender: ['男', '女'],
    genderIndex: 0,
    userInfo: {},
    fileList: [],
    avatar: ''
  },

  // 改变头像
  async beforeRead(event) {
    console.log(event);
    const { file } = event.detail;
    this.setData({ avatar: file.path })
    console.log(file.path.substring(55, -1).substring(11));
    const res = await wx.p.request({
      url: 'https://toutiao.itheima.net/v1_0/user/photo',
      header: {
        "Content-Type": "multipart/form-data",
        Authorization: `Bearer ${store.token}`,  
      },
      method: 'PATCH',
      data: {
        photo: file
      }
    })
    console.log(res);
    // wx.uploadFile({
    //   url: 'http://liufusong.top/' + file.path.substring(55, -1).substring(11),
    //   filePath: file.path,
    //   method: 'PATCH',
    //   name: 'file',
    //   header: {
    //     "Content-Type": "multipart/form-data",
    //     Authorization: `Bearer ${store.token}`
    //   },
    //   success(res) {
    //     console.log(res);
    //   }
    // })
  },

  // 昵称弹出层
  // 输入事件
  onBlurName(e) {
    console.log(e.detail.value);
    this.setData({
      name: e.detail.value
    })
  },
  // 保存
  async onConfirmName() {
    // this.setData({
    //   name: this.data.nameInput
    // })
    try {
      await wx.p.request({
        url: 'https://toutiao.itheima.net/v1_0/user/profile',
        method: 'PATCH',
        header: {
          Authorization: `Bearer ${store.token}`
        },
        data: {
          name: this.data.name
        }
      })
      Toast.success('更新成功')
      this.setData({
        showName: false
      })
    } catch(err) {
      console.log(err);
    }
  },
  // 打开弹出层
  changeName() {
    this.setData({
      showName: true
    })
    
  },
  onCancelName() {
    this.setData({
      showName: false
    })
  },
  onCloseName() {
    this.setData({
      showName: false
    })
  },

  // 生日弹出层
  async onConfirmBirth(event) {
    console.log(event.detail);
    
    // 编辑用户个人资料
    try {
      this.setData({
        formatDate: formatDate(event.detail),
      });
      await wx.p.request({
        url: 'https://toutiao.itheima.net/v1_0/user/profile',
        method: 'PATCH',
        header: {
          Authorization: `Bearer ${store.token}`
        },
        data: {
          birthday: this.data.formatDate
        }
      })
      Toast.success('更新成功')
      this.setData({
        birthDate: event.detail,
      });
      this.setData({
        showBirth: false
      })
    } catch(err) {
      console.log(err);
    }

  },
  // 取消
  onCancelBirth() {
    this.setData({ showBirth: false });
  },
  onCloseBirth() {
    this.setData({ showBirth: false });
  },
  // 显示弹窗
  changeBirth() {
    this.setData({
      showBirth: true
    })
  },

  // 性别弹出层
  // 确认
  async onConfirmGender(event) {
    const { picker, value, index } = event.detail;
    // 编辑用户个人资料
    try {
      await wx.p.request({
        url: 'https://toutiao.itheima.net/v1_0/user/profile',
        method: 'PATCH',
        header: {
          Authorization: `Bearer ${store.token}`
        },
        data: {
          gender: index
        }
      })
      this.setData({
        genderIndex: index
      })
      Toast.success('更新成功')
      this.setData({ showGender: false });
    } catch(err) {
      console.log(err);
    }
  },
  // 取消
  onCancelGender() {
    this.setData({ showGender: false });
  },
  onCloseGender() {
    this.setData({ showGender: false });
  },
  // 显示弹窗
  changeGender() {
    this.setData({ showGender: true });
  },

  /**
   * 生命周期函数--监听页面加载
   */
  async onLoad(options) {
    this.storeBindings = createStoreBindings(this, {
      store,
      fields: ['refresh_token', 'token', 'info'],
    })

    const { data } = await wx.p.request({
      url: 'https://toutiao.itheima.net/v1_0/user/profile',
      method: 'GET',
      header: {
        Authorization: `Bearer ${store.token}`
      }
    })
    console.log(data);
    this.setData({
      userInfo: data,
      avatar: data.data.photo
    })
    this.setData({
      genderIndex: data.data.gender
    })
    this.setData({
      birthDate: new Date(data.data.birthday).getTime()
    })
    this.setData({
      formatDate: data.data.birthday
    })
    // 文本框初始值
    this.setData({
      nameInput: data.data.name,
      name: data.data.name
    })
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady() {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow() {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide() {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload() {
    this.storeBindings.destroyStoreBindings()
  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh() {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom() {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage() {

  }
})